<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <h:body>
        <h2>Inscription</h2>
        <h3>Nouveau client ? Créez votre compte</h3>
        <h:form id="form">  
            <p:panel toggleable="true" id="panel"> 
                <h:panelGrid columns="2" cellpadding="5">

                    <h:outputLabel value="Civilité" for="civilite" />
                    <h:selectOneRadio id="civilite"
                                      value="#{mbComptes.utilisateur.civilite}" >
                        <f:selectItems value="#{mbComptes.listeCivilites}"
                                       var="gOp"
                                       itemLabel="#{gOp}"
                                       itemValue="#{gOp}"/>
                    </h:selectOneRadio>
                    <p:message for="civilite" />
                    
                </h:panelGrid> 
                
                <h:panelGrid columns="2" cellpadding="5">                

                    <h:outputLabel value="Votre nom : *" for="nom"/>
                    <p:inputText id="nom" 
                                 value="#{mbComptes.utilisateur.nom}"
                                 required="true">
                        <f:validateLength minimum="1" 
                                          maximum="50" 
                                          for="nom">
                        </f:validateLength>
                    </p:inputText>

                    <h:outputLabel value="Votre prénom :" for="prenom"/>
                    <p:inputText id="prenom" 
                                 value="#{mbComptes.utilisateur.prenom}" 
                                 required="false">
                        <f:validateLength minimum="1" 
                                          maximum="15" 
                                          for="prenom">
                        </f:validateLength>
                    </p:inputText>

                    <h:outputLabel value="Mon adresse e-mail est : *" />
                    <p:inputText value="#{mbComptes.utilisateur.email}"
                                 id="email"
                                 validatorMessage="Adresse email invalide">
                        <f:validateRegex pattern="[a-zA-Z0-9]+@[a-zA-Z]+.[a-zA-Z]{2,3}">
                        </f:validateRegex>
                    </p:inputText>

                    <h:outputLabel for="mdp1" value="Entrez un mot de passe : *" />
                    <p:password id="mdp1"
                                value="#{mbComptes.utilisateur.password}"    
                                label="password 2"
                                required="true"
                                match="mdp2">
                        <f:validateLength minimum="5" maximum="15" 
                                          for="password"></f:validateLength>
                    </p:password>

                    <h:outputLabel for="mdp2" value="Confirmez : *" />  
                    <p:password id="mdp2" 
                                value="#{mbComptes.checkMdp}" 
                                label="password 2" 
                                required="true"/>  

                    
                    <h:outputLabel value="Rue : " for="rue"/>
                    <p:inputText id="rue"
                                 value="#{mbComptes.adresse.rue}" 
                                 required="false">
                    </p:inputText>
                    
                    <h:outputLabel value="Complément adresse : " 
                                   for="complementAdresse"/>
                    <p:inputText id="complementAdresse" 
                                 value="#{mbComptes.adresse.complementAdresse}" 
                                 required="false">
                    </p:inputText>
                    
                    
                    <h:outputLabel value="Code Postal : " for="cp"/>
                    <p:inputMask id="cp" 
                                 value="#{mbComptes.adresse.codePostal}"
                                 required="false" 
                                 mask="99999"/>
                    <h:outputLabel value="Ville :" for="ville"/>
                    <p:inputText id="ville" 
                                 value="#{mbComptes.adresse.ville}" 
                                 required="false">
                    </p:inputText>
                    
                    <h:outputLabel value="Pays :" for="pays"/>
                    <p:inputText id="pays" 
                                 value="#{mbComptes.adresse.pays}" 
                                 required="false">
                       
                    </p:inputText>
                </h:panelGrid>  
            </p:panel>  

            <p:commandButton value="Valider" 
                             id="submit"
                             action="#{mbComptes.creerUtilisateur(mbSiteProperties.site)}" 
                             ajax="false"/>  
        </h:form>
    </h:body>
</html>